import 'package:flutter/material.dart';
import 'package:flutter_common_app/api/get_like_list_api.dart';
import 'package:flutter_common_app/api/get_song_detail_api.dart';
import 'package:flutter_common_app/api/get_user_level_api.dart';
import 'package:flutter_common_app/data/profile_data.dart';
import 'package:flutter_common_app/data/song_detail_data.dart';
import 'package:flutter_common_app/data/user_level_data.dart';
import 'package:flutter_common_app/provider_model/user_model.dart';
import 'package:flutter_common_app/utils/common_util/log_util.dart';
import 'package:flutter_common_app/widgets/custom_image/custom_image.dart';
import 'package:flutter_common_app/widgets/empty_view/h_empty_view.dart';
import 'package:flutter_common_app/widgets/empty_view/v_empty_view.dart';
import 'package:provider/provider.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

class MineTab extends StatefulWidget {
  @override
  _MineTabState createState() => _MineTabState();
}

class _MineTabState extends State<MineTab> with AutomaticKeepAliveClientMixin {
  @override
  bool get wantKeepAlive => true;

  UserLevelData userLevelData;

  List<dynamic> likeIdList = [];

  List<SongDetailData> likeList = [];

  @override
  void initState() {
    GetUserLevelApi(context).send().then((res) {
      setState(() {
        userLevelData = UserLevelData.fromJson(res.data['data']);
      });
    });
    GetLikeListApi(context).send().then((res) {
      likeIdList = res.data['ids'];
      GetSongDetailApi(context)
        ..getParams()['ids'] = likeIdList[likeIdList.length-1]
        ..send().then((res) {
          setState(() {
            likeList = SongDetailData.fromJsonList(res.data['songs']);
          });
        });
    });
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    super.build(context);
    return Scaffold(
      body: Container(
        decoration: BoxDecoration(
            gradient: LinearGradient(
          colors: [
            Colors.black.withOpacity(0.03),
            Colors.black.withOpacity(0.01),
          ],
          begin: Alignment.topCenter,
          end: Alignment.bottomCenter,
        )),
        child: ListView(
          padding: EdgeInsets.fromLTRB(30.w, 30.w, 30.w, 0),
          children: [
            buildUserInfoView(),
            VEmptyView(30.w),
            buildLikeSongView(),
          ],
        ),
      ),
    );
  }

  Widget buildUserInfoView() {
    return Consumer<UserModel>(builder: (context, UserModel userModel, child) {
      ProfileData profile = userModel.userInfoData?.profile;
      return Padding(
        padding: EdgeInsets.only(left: 10.w),
        child: GestureDetector(
          behavior: HitTestBehavior.opaque,
          onTap: () {
            LogUtil.v('跳转到个人详情');
          },
          child: Row(
            children: [
              CustomImage.network(
                profile?.avatarUrl ?? '',
                width: 110.w,
                height: 110.w,
                borderRadius: BorderRadius.all(
                  Radius.circular(10000.w),
                ),
                border: Border.all(color: Colors.white, width: 5.w),
              ),
              HEmptyView(30.w),
              Expanded(
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Text(
                      profile?.nickname ?? '',
                      style: TextStyle(
                        fontSize: 34.sp,
                        fontWeight: FontWeight.w500,
                        color: Colors.black,
                      ),
                    ),
                    VEmptyView(5.w),
                    Container(
                      padding:
                          EdgeInsets.symmetric(vertical: 4.w, horizontal: 20.w),
                      decoration: BoxDecoration(
                        color: Colors.white,
                        borderRadius: BorderRadius.all(
                          Radius.circular(1000.w),
                        ),
                      ),
                      child: Text(
                        'Lv.${userLevelData?.level ?? 0}',
                        style: TextStyle(
                          color: Colors.black,
                          fontSize: 26.sp,
                        ),
                      ),
                    ),
                  ],
                ),
              ),
              Icon(Icons.keyboard_arrow_right),
            ],
          ),
        ),
      );
    });
  }

  Widget buildLikeSongView(){
    return Container(
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.all(
          Radius.circular(20.w),
        ),
      ),
      width: 750.w,
      padding: EdgeInsets.all(30.w),
      child: Row(
        children: [
          if (likeList.isNotEmpty)
            Stack(
              children: [
                CustomImage.network(
                  likeList[0].al.picUrl,
                  width: 120.w,
                  borderRadius: BorderRadius.all(
                    Radius.circular(20.w),
                  ),
                ),
                Container(
                  width: 120.w,
                  height: 120.w,
                  decoration: BoxDecoration(
                    borderRadius: BorderRadius.all(
                      Radius.circular(20.w),
                    ),
                    color: Colors.black.withOpacity(0.1),
                  ),
                  child: Icon(Icons.opacity,color: Colors.white,),
                ),
              ],
            ),
          HEmptyView(30.w),
          Expanded(
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Text(
                  '我喜欢的音乐',
                  style: TextStyle(
                    color: Colors.black,
                    fontSize: 32.sp,
                  ),
                ),
                VEmptyView(10.w),
                Text(
                  '${likeIdList.length}首',
                  style: TextStyle(
                    color: Colors.black45,
                    fontSize: 26.sp,
                  ),
                ),
              ],
            ),
          ),
          Container(
            padding: EdgeInsets.symmetric(horizontal: 14.w,vertical: 5.w),
            decoration: BoxDecoration(
              borderRadius: BorderRadius.all(
                Radius.circular(10000),
              ),
              border: Border.all(color: Colors.black26, width: 1.w),
            ),
            child: Row(
              children: [
                Icon(
                  Icons.opacity,
                  size: 15,
                  color: Colors.black87,
                ),
                Text(
                  '心动模式',
                  style: TextStyle(
                    color: Colors.black87,
                    fontSize: 22.sp,
                  ),
                )
              ],
            ),
          ),
        ],
      ),
    );
  }
}
